import React from 'react';
import {Row,Col,Menu} from "antd";
import { RedditCircleFilled, ZhihuCircleFilled, SmileTwoTone } from '@ant-design/icons';
import header from '../styles/header.module.css';

const Header=()=>{
    return (
        <div className={header.header}>
            <Row type="flex" justify="center">
                <Col xs={24} sm={24} ms={10} lg={10} sl={10}>
                    <span className={header.header_logo}>小星星</span>
                    <span className={header.header_txt}>一个前端菜鸟</span>
                </Col>
                <Col xs={0} sm={0} ms={14} lg={8} sl={6}>
                    <Menu mode="horizontal">
                        <Menu.Item key="home" icon={<RedditCircleFilled />}>
                            首页
                        </Menu.Item>
                        <Menu.Item key="video" icon={<ZhihuCircleFilled />}>
                            知乎
                        </Menu.Item>
                        <Menu.Item key="lift" icon={<SmileTwoTone />}>
                            生活
                        </Menu.Item>
                    </Menu>
                </Col>
            </Row>
        </div>
    )
}
export default Header
